<template>
    <view>
        <scroll-view :scroll-y="true" :scroll-x="false" class="scroll" @scrolltolower="bindlower">
            <view class="wuge" v-if="allTeachers == '' || allTeachers.length == 0">没有任何教师信息</view>
            <view class="list" v-for="(item, index) in allTeachers" :key="index">
                <view class="item" @tap="toDetail" :data-id="item.id + ',' + item.teacherName + ',' + item.courseCount">
                    <view class="image" @tap="toDetail" :data-id="item.id + ',' + item.teacherName + ',' + item.courseCount">
                        <image :src="item.teacherHeadimgurl" />
                    </view>
                    <view class="content">
                        <text class="h1">
                          <td style="width:25%">{{ item.teacherName }}</td>
                          <td style="width:70%">{{ item.teacherTag }}</td>
                        </text>
                        <text class="p">{{ item.teacherIntroduction }}</text>
                    </view>
                    <view class="number">
                        <view class="sum">{{ item.courseCount }}门课</view>
                    </view>
                </view>
            </view>
        </scroll-view>
    </view>
</template>

<script>
var config = require('../../config.js');
var http = require('../../utils/httpHelper.js');
export default {
    data() {
        return {
            teacher: {},
            allTeachers: [],
            sumPrice: 0,
            timer: {},
            teacherPage: {
                current: 1,
                pageSize: 10,
                total: 0
            }
        };
    },
    onLoad: function () {
        var that = this;
        that.getAllTeachers(function (list) {
            that.setData({
                allTeachers: list
            });
        });
    },
    methods: {
        getMoreData() {
            var that = this;
            that.teacherPage.current++;
            that.getAllTeachers(function (list) {
                let yList = that.allTeachers;
                yList = yList.concat(list);
                that.setData({
                    allTeachers: yList
                });
            });
        },

        getAllTeachers: function (callback) {
            var that = this;
            http.httpPost(
                config.clubApi.getTeacherList,
                {
                    appid: config.APPID,
                    pageNo: that.teacherPage.current,
                    pageSize: that.teacherPage.pageSize,
                    teacherType: '3'
                },
                function (res) {
                    if (res.code == '200') {
                        var list = res.data.pageData;
                        if (typeof callback == 'function') {
                            callback(list);
                        }
                    }
                }
            );
        },

        toDetail: function (e) {
            var idParam = e.currentTarget.dataset.id;
            var idParamAry = idParam.split(',');
            if (idParamAry[2] > 0) {
                uni.navigateTo({
                    url: '../course/index?teacherId=' + idParamAry[0] + '&teacherName=' + idParamAry[1]
                });
            } else {
                uni.showToast({
                    title: '没有课程可以展示',
                    icon: 'success',
                    duration: 1000
                });
            }
        },

        getTeacherInfo: function (id, callback) {
            var data = {
                id: id
            };
            http.httpGet(config.clubApi.getTeacherInfo, data, function (res) {
                if (res.code == '200') {
                    var shop = res.data;
                    if (typeof callback == 'function') {
                        callback(shop);
                    }
                }
            });
        },

        //处理分页
        bindlower: function (e) {
          if(this.timer != null){
            clearTimeout(this.timer)
          }
          this.timer = setTimeout(()=>{
            this.getMoreData();
          },500)
        }
    }
};
</script>
<style lang="scss">
@import './index.scss';
</style>
